<template>
  <div>
    <el-dialog
      :title="dialogTitle"
      :visible.sync="show"
      :before-close="cancel"
      width="60%"
    >
      <div class="formBox" v-if="showBasicInfo">
        <div class="formHead">企业基础信息</div>

        <!-- 企业基础信息表格 -->
        <div class="formTable">
          <div class="formRow">
            <div class="formCell left">企业名称</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.companyName
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.companyName"
              ></el-input>
            </div>
            <div class="formCell left">归属行政区</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{ companyInfo.district }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.district"
              ></el-input>
            </div>
          </div>

          <div class="formRow gray">
            <div class="formCell left">注册地址</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.registeredAddress
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.registeredAddress"
              ></el-input>
            </div>
            <div class="formCell left">邮政编码</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.registeredPostalCode
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.registeredPostalCode"
              ></el-input>
            </div>
          </div>

          <div class="formRow">
            <div class="formCell left">办公地址</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.officeAddress
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.officeAddress"
              ></el-input>
            </div>
            <div class="formCell left">邮政编码</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.officePostalCode
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.officePostalCode"
              ></el-input>
            </div>
          </div>

          <div class="formRow gray">
            <div class="formCell left">企业类型</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.companyType
              }}</span>
              <el-select
                v-if="canEditBasicInfo"
                v-model="companyInfo.companyType"
                placeholder="请选择企业类型"
              >
                <el-option
                  label="集团委托企业"
                  value="集团委托企业"
                ></el-option>
                <el-option label="其他" value="其他"></el-option>
              </el-select>
            </div>
            <div class="formCell left">收费标准</div>
            <div class="formCell right">
              <ImageMiniUpload
                v-model="companyInfo.chargeStandard"
                :limit="3"
                :isShowTip="false"
                :fileType="['png', 'jpg', 'jpeg']"
                :disabled="!canEditBasicInfo"
              />
            </div>
          </div>

          <div class="formRow">
            <div class="formCell left">是否房管集团下属企业</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.isSubsidiary
              }}</span>
              <el-select
                v-if="canEditBasicInfo"
                v-model="companyInfo.isSubsidiary"
                placeholder="请选择"
              >
                <el-option label="是" value="是"></el-option>
                <el-option label="否" value="否"></el-option>
              </el-select>
            </div>
            <div class="formCell left">是否采用派单模式</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.isOrderMode
              }}</span>
              <el-select
                v-if="canEditBasicInfo"
                v-model="companyInfo.isOrderMode"
                placeholder="请选择"
              >
                <el-option label="是" value="是"></el-option>
                <el-option label="否" value="否"></el-option>
              </el-select>
            </div>
          </div>

          <div class="formRow gray">
            <div class="formCell left">统一社会信用代码证编号</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.socialCreditCode
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.socialCreditCode"
              ></el-input>
            </div>
            <div class="formCell left">统一社会信用代码证有效期</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.socialCreditCodeExpiry
              }}</span>
              <el-date-picker
                v-if="canEditBasicInfo"
                v-model="companyInfo.socialCreditCodeExpiry"
                type="date"
                placeholder="选择日期"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </div>
          </div>

          <div class="formRow">
            <div class="formCell left">法人代表</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.legalRepresentative
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.legalRepresentative"
              ></el-input>
            </div>
            <div class="formCell left">法人代表联系电话</div>
            <div class="formCell right">
              <span v-if="!canEditBasicInfo">{{
                companyInfo.legalRepresentativePhone
              }}</span>
              <el-input
                v-if="canEditBasicInfo"
                v-model="companyInfo.legalRepresentativePhone"
              ></el-input>
            </div>
          </div>

          <!-- 联系方式部分 -->
          <div class="contact-section">
            <div class="contact-label-cell">联系方式</div>
            <div class="contact-content">
              <div class="formRow">
                <div class="formCell left">联系人</div>
                <div class="formCell right">
                  <span v-if="!canEditBasicInfo">{{
                    companyInfo.contactPerson
                  }}</span>
                  <el-input
                    v-if="canEditBasicInfo"
                    v-model="companyInfo.contactPerson"
                  ></el-input>
                </div>
                <div class="formCell left">联系电话</div>
                <div class="formCell right">
                  <span v-if="!canEditBasicInfo">{{
                    companyInfo.contactPhone
                  }}</span>
                  <el-input
                    v-if="canEditBasicInfo"
                    v-model="companyInfo.contactPhone"
                  ></el-input>
                </div>
              </div>

              <div class="formRow gray">
                <div class="formCell left">网址</div>
                <div class="formCell right">
                  <span v-if="!canEditBasicInfo">{{
                    companyInfo.website
                  }}</span>
                  <el-input
                    v-if="canEditBasicInfo"
                    v-model="companyInfo.website"
                  ></el-input>
                </div>
                <div class="formCell left">传真</div>
                <div class="formCell right">
                  <span v-if="!canEditBasicInfo">{{ companyInfo.fax }}</span>
                  <el-input
                    v-if="canEditBasicInfo"
                    v-model="companyInfo.fax"
                  ></el-input>
                </div>
              </div>

              <div class="formRow">
                <div class="formCell left">电子邮箱</div>
                <div class="formCell right">
                  <span v-if="!canEditBasicInfo">{{ companyInfo.email }}</span>
                  <el-input
                    v-if="canEditBasicInfo"
                    v-model="companyInfo.email"
                    type="email"
                  ></el-input>
                </div>
                <div class="formCell left">注册资金(万元)</div>
                <div class="formCell right">
                  <span v-if="!canEditBasicInfo">{{
                    companyInfo.registeredCapital
                  }}</span>
                  <el-input
                    v-if="canEditBasicInfo"
                    v-model="companyInfo.registeredCapital"
                    type="number"
                  ></el-input>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="formBox" style="margin-top: 20px" v-if="showQualification">
        <!-- 具体资质情况 -->
        <div class="formHead">具体资质情况</div>

        <div class="formTable">
          <!-- 企业人员情况 -->
          <div class="personnel-section">
            <div class="personnel-label-cell">
              <div>企业人员情况</div>
              <div class="personnel-detail" @click="openPersonnelDialog">
                人员详情
              </div>
            </div>
            <div class="personnel-content">
              <div class="formRow">
                <div class="formCell left">企业总人数(人)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.totalEmployees
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.totalEmployees"
                    type="number"
                  ></el-input>
                </div>
              </div>

              <div class="formRow gray">
                <div class="formCell left">在编人数(人)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.permanentEmployees
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.permanentEmployees"
                    type="number"
                  ></el-input>
                </div>
              </div>

              <div class="formRow">
                <div class="formCell left">临时工(人)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.temporaryWorkers
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.temporaryWorkers"
                    type="number"
                  ></el-input>
                </div>
              </div>
            </div>
          </div>

          <!-- 初级职称 -->
          <div class="formRow gray">
            <div class="formCell left title-label">初级职称</div>
            <div class="formCell left">技工人员(人)</div>
            <div class="formCell right">
              <span v-if="!canEditQualification">{{
                qualificationInfo.juniorTitle.skilledWorkers
              }}</span>
              <el-input
                v-if="canEditQualification"
                v-model="qualificationInfo.juniorTitle.skilledWorkers"
                type="number"
              ></el-input>
            </div>
            <div class="formCell left">技术人员(人)</div>
            <div class="formCell right">
              <span v-if="!canEditQualification">{{
                qualificationInfo.juniorTitle.technicalPersonnel
              }}</span>
              <el-input
                v-if="canEditQualification"
                v-model="qualificationInfo.juniorTitle.technicalPersonnel"
                type="number"
              ></el-input>
            </div>
          </div>

          <!-- 中级职称 -->
          <div class="formRow">
            <div class="formCell left title-label">中级职称</div>
            <div class="formCell left">技工人员(人)</div>
            <div class="formCell right">
              <span v-if="!canEditQualification">{{
                qualificationInfo.intermediateTitle.skilledWorkers
              }}</span>
              <el-input
                v-if="canEditQualification"
                v-model="qualificationInfo.intermediateTitle.skilledWorkers"
                type="number"
              ></el-input>
            </div>
            <div class="formCell left">技术人员(人)</div>
            <div class="formCell right">
              <span v-if="!canEditQualification">{{
                qualificationInfo.intermediateTitle.technicalPersonnel
              }}</span>
              <el-input
                v-if="canEditQualification"
                v-model="qualificationInfo.intermediateTitle.technicalPersonnel"
                type="number"
              ></el-input>
            </div>
          </div>

          <!-- 高级职称 -->
          <div class="formRow gray">
            <div class="formCell left title-label">高级职称</div>
            <div class="formCell left">技工人员(人)</div>
            <div class="formCell right">
              <span v-if="!canEditQualification">{{
                qualificationInfo.seniorTitle.skilledWorkers
              }}</span>
              <el-input
                v-if="canEditQualification"
                v-model="qualificationInfo.seniorTitle.skilledWorkers"
                type="number"
              ></el-input>
            </div>
            <div class="formCell left">技术人员(人)</div>
            <div class="formCell right">
              <span v-if="!canEditQualification">{{
                qualificationInfo.seniorTitle.technicalPersonnel
              }}</span>
              <el-input
                v-if="canEditQualification"
                v-model="qualificationInfo.seniorTitle.technicalPersonnel"
                type="number"
              ></el-input>
            </div>
          </div>

          <!-- 白蚁防治设备情况 -->
          <div class="equipment-section">
            <div class="equipment-label-cell">白蚁防治设备情况</div>
            <div class="equipment-content">
              <div class="formRow">
                <div class="formCell left">配备实验室(m²)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.equipment.laboratory
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.equipment.laboratory"
                    type="number"
                  ></el-input>
                </div>
                <div class="formCell left">配备标本室(m²)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.equipment.specimenRoom
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.equipment.specimenRoom"
                    type="number"
                  ></el-input>
                </div>
              </div>

              <div class="formRow gray">
                <div class="formCell left">药品专用仓库(m²)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.equipment.medicineWarehouse
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.equipment.medicineWarehouse"
                    type="number"
                  ></el-input>
                </div>
                <div class="formCell left">展示厅(m²)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.equipment.exhibitionHall
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.equipment.exhibitionHall"
                    type="number"
                  ></el-input>
                </div>
              </div>

              <div class="formRow">
                <div class="formCell left">其他(m²)</div>
                <div class="formCell right">
                  <span v-if="!canEditQualification">{{
                    qualificationInfo.equipment.other
                  }}</span>
                  <el-input
                    v-if="canEditQualification"
                    v-model="qualificationInfo.equipment.other"
                    type="number"
                  ></el-input>
                </div>
                <div class="formCell left"></div>
                <div class="formCell right"></div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="formBox" style="margin-top: 20px" v-if="showCases">
        <div style="margin-bottom: 10px" v-if="editFlag">
          <el-button type="primary" size="small" @click="addCaseItem"
            >新增</el-button
          >
          <!-- <el-button type="danger" size="small">删除</el-button> -->
        </div>
        <div class="formHead">过往成功防治案例</div>
        <el-table v-loading="loading" :data="caseList" border stripe :key="1">
          <el-table-column
            label="序号"
            align="center"
            type="index"
          ></el-table-column>
          <el-table-column label="小区名称" align="center" prop="communityName">
          </el-table-column>
          <el-table-column
            label="防治面积(m²)"
            align="center"
            prop="controlArea"
          >
            <template slot-scope="scope">
              <div class="control-area-cell">
                {{ scope.row.controlArea }}
              </div>
            </template>
          </el-table-column>
          <el-table-column label="防治方案" align="center" prop="controlPlan">
          </el-table-column>
          <el-table-column
            label="效果评估"
            align="center"
            prop="effectEvaluation"
          >
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            class-name="small-padding fixed-width"
            width="100"
            fixed="right"
            v-if="editFlag"
          >
            <template slot-scope="scope">
              <el-button size="mini" type="text" @click="editItem(scope.row)"
                >编辑</el-button
              >
              <el-button
                size="mini"
                type="text"
                style="color: red"
                @click="delItem(scope.row)"
                >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="caseTotal > 0"
          :total="caseTotal"
          :page.sync="caseQueryParams.pageNum"
          :limit.sync="caseQueryParams.pageSize"
          @pagination="getCaseList"
          class="pagination-container"
        />
      </div>

      <div class="formBox" style="margin-top: 20px" v-if="showHonor">
        <div style="margin-bottom: 10px" v-if="editFlag">
          <el-button type="primary" size="small" @click="addHonorItem"
            >新增</el-button
          >
        </div>
        <div class="formHead">企业荣誉</div>
        <el-table
          v-loading="honorLoading"
          :data="honorList"
          border
          stripe
          :key="3"
        >
          <el-table-column
            label="序号"
            align="center"
            type="index"
          ></el-table-column>
          <el-table-column label="级别" align="center" prop="level" width="120">
          </el-table-column>
          <el-table-column label="奖项名称" align="center" prop="awardName">
          </el-table-column>
          <el-table-column label="查看附件" align="center" width="150">
            <template slot-scope="scope">
              <span
                @click="viewHonorAttachment(scope.row)"
                class="attachment-link"
                >查看附件</span
              >
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            class-name="small-padding fixed-width"
            width="100"
            fixed="right"
            v-if="editFlag"
          >
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                @click="editHonorItem(scope.row)"
                >编辑</el-button
              >
              <el-button
                size="mini"
                type="text"
                style="color: red"
                @click="delHonorItem(scope.row)"
                >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="honorTotal > 0"
          :total="honorTotal"
          :page.sync="honorQueryParams.pageNum"
          :limit.sync="honorQueryParams.pageSize"
          @pagination="getHonorList"
          class="pagination-container"
        />

        <div style="margin-bottom: 10px; margin-top: 20px" v-if="editFlag">
          <el-button type="primary" size="small" @click="addCommendationItem"
            >新增</el-button
          >
        </div>
        <div class="formHead">政府表彰</div>
        <el-table
          v-loading="commendationLoading"
          :data="commendationList"
          border
          stripe
          :key="4"
        >
          <el-table-column
            label="序号"
            align="center"
            type="index"
          ></el-table-column>
          <el-table-column label="级别" align="center" prop="level" width="120">
          </el-table-column>
          <el-table-column
            label="奖项名称"
            align="center"
            prop="commendationName"
          >
          </el-table-column>
          <el-table-column label="查看附件" align="center" width="150">
            <template slot-scope="scope">
              <span
                @click="viewCommendationAttachment(scope.row)"
                class="attachment-link"
                >查看附件</span
              >
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            class-name="small-padding fixed-width"
            width="100"
            fixed="right"
            v-if="editFlag"
          >
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                @click="editCommendationItem(scope.row)"
                >编辑</el-button
              >
              <el-button
                size="mini"
                type="text"
                style="color: red"
                @click="delCommendationItem(scope.row)"
                >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="commendationTotal > 0"
          :total="commendationTotal"
          :page.sync="commendationQueryParams.pageNum"
          :limit.sync="commendationQueryParams.pageSize"
          @pagination="getCommendationList"
          class="pagination-container"
        />

        <!-- 底部统计信息 -->
        <div class="summary-table-container">
          <div class="summary-table">
            <div class="summary-row">
              <div class="summary-cell">
                <div class="summary-label">近一年 受理白蚁任务单总量</div>
              </div>
              <div class="summary-cell">
                <div class="summary-value">10</div>
              </div>
              <div class="summary-cell">
                <div class="summary-label">历史 受理白蚁任务单总量</div>
              </div>
              <div class="summary-cell">
                <div class="summary-value">100</div>
              </div>
            </div>
            <div class="summary-row">
              <div class="summary-cell">
                <div class="summary-label">复治率</div>
              </div>
              <div class="summary-cell">
                <div class="summary-value">10%</div>
              </div>
              <div class="summary-cell">
                <div class="summary-label">每一年上报及时率</div>
              </div>
              <div class="summary-cell">
                <div class="summary-value">60%</div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 企业特色模块 -->
      <div class="formBox" style="margin-top: 20px" v-if="showFeature">
        <div class="formHead">企业特色</div>
        <div class="formWhite" style="min-height: 100px">
          <div class="right" style="padding: 15px">
            <span
              v-if="!canEditFeature"
              style="white-space: pre-wrap; line-height: 1.8"
              >{{ companyFeature.featureContent || "暂无企业特色信息" }}</span
            >
            <el-input
              v-if="canEditFeature"
              v-model="companyFeature.featureContent"
              type="textarea"
              :rows="4"
              placeholder="请输入企业特色内容"
              maxlength="1000"
              show-word-limit
            ></el-input>
          </div>
        </div>
      </div>

      <div class="formBox" style="margin-top: 20px" v-if="showNegative">
        <div style="margin-bottom: 10px" v-if="canEditNegative">
          <el-button type="primary" size="small" @click="addNegativeItem"
            >新增</el-button
          >
        </div>
        <div class="formHead">企业负面信息</div>
        <el-table
          v-loading="negativeLoading"
          :data="negativeList"
          border
          stripe
          :key="2"
        >
          <el-table-column
            label="时间"
            align="center"
            prop="time"
            width="120"
          ></el-table-column>
          <el-table-column
            label="类型"
            align="center"
            prop="type"
            width="150"
          ></el-table-column>
          <el-table-column
            label="具体负面情况"
            align="center"
            prop="negativeSituation"
            min-width="300"
          ></el-table-column>
          <el-table-column
            label="操作"
            align="center"
            class-name="small-padding fixed-width"
            width="100"
            fixed="right"
            v-if="canEditNegative"
          >
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                @click="editDialog3Item(scope.row)"
                >编辑</el-button
              >
              <el-button
                size="mini"
                type="text"
                style="color: red"
                @click="delItem(scope.row)"
                >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="negativeTotal > 0"
          :total="negativeTotal"
          :page.sync="negativeQueryParams.pageNum"
          :limit.sync="negativeQueryParams.pageSize"
          @pagination="getNegativeList"
          class="pagination-container"
        />
      </div>

      <!-- 底部按钮区域 -->
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取消</el-button>
        <el-button v-if="showEditButton" type="primary" @click="editCompany"
          >保存</el-button
        >
      </div>
    </el-dialog>
    <dialog1
      v-if="dialog1Show"
      :show="dialog1Show"
      :detailForm="dialog1Form"
      @closeMsg="closeDialog1"
    ></dialog1>
    <dialog3
      v-if="dialog3Show"
      :show="dialog3Show"
      :detailForm="dialog3Form"
      @closeMsg="closeDialog3"
    ></dialog3>
    <honorDialog
      v-if="honorDialogShow"
      :show="honorDialogShow"
      :detailForm="honorDialogForm"
      :dialogType="honorDialogType"
      @closeMsg="closeHonorDialog"
    ></honorDialog>
    <personnelDialog
      v-if="personnelDialogShow"
      :show="personnelDialogShow"
      @closeMsg="closePersonnelDialog"
    ></personnelDialog>
  </div>
</template>

<script>
import dialog1 from "./dialog1.vue";
import dialog3 from "./dialog3.vue";
import honorDialog from "./honorDialog.vue";
import personnelDialog from "./personnelDialog.vue";
import ImageMiniUpload from "@/components/ImageMiniUpload";
import { mapGetters } from "vuex";
export default {
  props: ["show", "editFlag", "editSection"],
  components: {
    dialog1,
    dialog3,
    honorDialog,
    personnelDialog,
    ImageMiniUpload,
  },
  data() {
    return {
      companyInfo: {
        companyName: "上海山西物业管理有限公司",
        district: "静安区",
        registeredAddress: "海宁路1230弄54号",
        registeredPostalCode: "200071",
        officeAddress: "海宁路1230弄54号",
        officePostalCode: "200071",
        companyType: "集团委托企业",
        chargeStandard: "", // 收费标准，存储图片路径，多个图片用逗号分隔
        isSubsidiary: "否",
        socialCreditCode: "70306480-1",
        socialCreditCodeExpiry: "2022-09-22",
        legalRepresentative: "刘耀松",
        legalRepresentativePhone: "13801857162",
        contactPerson: "丛培荣",
        contactPhone: "13651680165",
        website: "-",
        fax: "63092609",
        email: "-",
        registeredCapital: "320.00",
      },
      qualificationInfo: {
        totalEmployees: "36",
        permanentEmployees: "30",
        temporaryWorkers: "6",
        juniorTitle: {
          skilledWorkers: "10",
          technicalPersonnel: "2",
        },
        intermediateTitle: {
          skilledWorkers: "10",
          technicalPersonnel: "2",
        },
        seniorTitle: {
          skilledWorkers: "10",
          technicalPersonnel: "2",
        },
        equipment: {
          laboratory: "36",
          specimenRoom: "30",
          medicineWarehouse: "30",
          exhibitionHall: "30",
          other: "6",
        },
      },
      loading: false,
      caseList: [
        {
          communityName: "xx/小区",
          controlArea: "34",
          controlPlan: "药物喷洒、熏蒸、诱杀",
          effectEvaluation: "好",
        },
        {
          communityName: "xx/小区",
          controlArea: "35",
          controlPlan: "药物喷洒、熏蒸、诱杀",
          effectEvaluation: "好",
        },
        {
          communityName: "xx/小区",
          controlArea: "36",
          controlPlan: "药物喷洒、熏蒸、诱杀",
          effectEvaluation: "好",
        },
        {
          communityName: "xx/小区",
          controlArea: "37",
          controlPlan: "药物喷洒、熏蒸、诱杀",
          effectEvaluation: "好",
        },
        {
          communityName: "xx/小区",
          controlArea: "38",
          controlPlan: "药物喷洒、熏蒸、诱杀",
          effectEvaluation: "好",
        },
      ],
      caseTotal: 446,
      caseQueryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      negativeList: [
        {
          time: "2025-08-13",
          type: "行政处罚",
          negativeSituation: "罚款20万元",
        },
        {
          time: "2025-08-12",
          type: "负面舆情",
          negativeSituation: "XX小区业主投诉白蚁防治无效果",
        },
        {
          time: "2025-08-11",
          type: "诚信经营事件",
          negativeSituation: "虚报收费项目",
        },
        {
          time: "2025-08-10",
          type: "其他",
          negativeSituation: "-",
        },
        {
          time: "2025-08-09",
          type: "负面舆情",
          negativeSituation: "XX小区业主投诉白蚁防治无效果",
        },
      ],
      negativeTotal: 446,
      negativeQueryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      negativeLoading: false,
      // 企业特色数据
      companyFeature: {
        featureContent:
          '公司以"快速、便捷、优质"为白蚁灭治服务理念,全年365天24小时不间断受理居民报修,坚持"灭虫、消毒、防控"三位一体的全过程监管策略。',
      },
      honorList: [
        {
          level: "国家级",
          awardName: "xx奖项",
        },
        {
          level: "国家级",
          awardName: "xx奖项",
        },
        {
          level: "省市级",
          awardName: "xx奖项",
        },
        {
          level: "区级",
          awardName: "xx奖项",
        },
        {
          level: "协会级",
          awardName: "xx奖项",
        },
      ],
      honorTotal: 446,
      honorQueryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      honorLoading: false,
      commendationList: [
        {
          level: "国家级",
          commendationName: "xx奖项",
        },
        {
          level: "国家级",
          commendationName: "xx奖项",
        },
        {
          level: "省市级",
          commendationName: "xx奖项",
        },
        {
          level: "区级",
          commendationName: "xx奖项",
        },
        {
          level: "协会级",
          commendationName: "xx奖项",
        },
      ],
      commendationTotal: 446,
      commendationQueryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      commendationLoading: false,
      dialog1Show: false,
      dialog1Form: {},
      dialog3Show: false,
      dialog3Form: {},
      honorDialogShow: false,
      honorDialogForm: {},
      honorDialogType: "honor", // honor: 企业荣誉, commendation: 政府表彰
      personnelDialogShow: false, // 人员详情弹窗
    };
  },
  created() {},
  computed: {
    ...mapGetters(["parentMsg"]),
    // 弹窗标题
    dialogTitle() {
      const titleMap = {
        basic: "企业档案→企业基础信息",
        qualification: "企业档案→具体资质情况",
        cases: "企业档案→过往成功防治案例",
        honor: "企业档案→企业荣誉",
        commendation: "企业档案→政府表彰",
        negative: "企业档案→企业负面信息",
        feature: "企业档案→企业特色",
      };
      return this.editSection
        ? titleMap[this.editSection]
        : "企业档案→企业详细信息";
    },
    // 判断是否可编辑企业基础信息
    canEditBasicInfo() {
      return this.editFlag && this.editSection === "basic";
    },
    // 判断是否可编辑具体资质情况
    canEditQualification() {
      return this.editFlag && this.editSection === "qualification";
    },
    // 判断是否可编辑企业负面信息（只有 deptType 为 80、81、93 时才能编辑）
    canEditNegative() {
      const allowedDeptTypes = ["80", "81", "93"];
      return (
        this.editFlag &&
        this.editSection === "negative" &&
        this.parentMsg &&
        allowedDeptTypes.includes(this.parentMsg.deptType)
      );
    },
    // 判断是否显示各个模块
    showBasicInfo() {
      return !this.editSection || this.editSection === "basic";
    },
    showQualification() {
      return !this.editSection || this.editSection === "qualification";
    },
    showCases() {
      return !this.editSection || this.editSection === "cases";
    },
    showHonor() {
      return (
        !this.editSection ||
        this.editSection === "honor" ||
        this.editSection === "commendation"
      );
    },
    showNegative() {
      return !this.editSection || this.editSection === "negative";
    },
    // 判断是否显示企业特色模块
    showFeature() {
      return !this.editSection || this.editSection === "feature";
    },
    // 判断是否可编辑企业特色
    canEditFeature() {
      return this.editFlag && this.editSection === "feature";
    },
    // 判断是否显示底部编辑按钮（只有编辑企业基础信息、具体资质情况和企业特色时才显示）
    showEditButton() {
      return (
        this.editSection === "basic" ||
        this.editSection === "qualification" ||
        this.editSection === "feature"
      );
    },
  },
  mounted() {
    console.log(this.parentMsg, "parentMsg");
  },
  watch: {
    editSection: {
      handler(newVal) {
        if (newVal && this.show) {
          // 根据不同的 editSection 值执行不同的操作
          this.$nextTick(() => {
            this.handleEditSection(newVal);
          });
        }
      },
      immediate: true,
    },
  },
  methods: {
    handleEditSection(section) {
      // 根据 editSection 的值，模块会自动显示/隐藏
      // 这里可以添加滚动到对应模块的逻辑
      console.log("当前编辑模块:", section);
    },
    addCaseItem() {
      // 新增案例
      console.log("新增案例");
      this.dialog1Form = {};
      this.dialog1Show = true;
    },
    cancel() {
      this.$emit("closeMsg");
    },
    getCaseList() {
      // 获取案例列表的方法
      console.log("获取案例列表");
    },
    getNegativeList() {
      // 获取负面信息列表的方法
      console.log("获取负面信息列表");
    },
    editCompany() {
      // 根据不同的展示页面，打印对应的数据
      let dataToPrint = {};
      let sectionName = "";

      switch (this.editSection) {
        case "basic":
          // 企业基础信息
          dataToPrint = this.companyInfo;
          sectionName = "企业基础信息";
          break;
        case "qualification":
          // 具体资质情况
          dataToPrint = this.qualificationInfo;
          sectionName = "具体资质情况";
          break;
        case "cases":
          // 过往成功防治案例
          dataToPrint = this.caseList;
          sectionName = "过往成功防治案例";
          break;
        case "honor":
          // 企业荣誉
          dataToPrint = this.honorList;
          sectionName = "企业荣誉";
          break;
        case "commendation":
          // 政府表彰
          dataToPrint = this.commendationList;
          sectionName = "政府表彰";
          break;
        case "negative":
          // 企业负面信息
          dataToPrint = this.negativeList;
          sectionName = "企业负面信息";
          break;
        case "feature":
          // 企业特色
          dataToPrint = this.companyFeature;
          sectionName = "企业特色";
          break;
        default:
          // 默认打印企业基础信息
          dataToPrint = this.companyInfo;
          sectionName = "企业基础信息";
          break;
      }

      console.log(`保存${sectionName}:`, dataToPrint);

      this.$emit("editCompany", {
        section: this.editSection,
        data: dataToPrint,
      });
    },
    getHonorList() {
      // 获取企业荣誉列表的方法
      console.log("获取企业荣誉列表");
    },
    viewHonorAttachment(row) {
      // 查看荣誉附件的方法
      console.log("查看荣誉附件", row);
      this.$message.info("查看附件功能待实现");
    },
    editHonorItem(row) {
      // 编辑企业荣誉项的方法
      console.log("编辑荣誉项", row);
      this.honorDialogType = "honor";
      this.honorDialogForm = { ...row };
      this.honorDialogShow = true;
    },
    addHonorItem() {
      // 新增企业荣誉项的方法
      console.log("新增企业荣誉");
      this.honorDialogType = "honor";
      this.honorDialogForm = {}; // 传空对象表示新增
      this.honorDialogShow = true;
    },
    getCommendationList() {
      // 获取政府表彰列表的方法
      console.log("获取政府表彰列表");
    },
    viewCommendationAttachment(row) {
      // 查看政府表彰附件的方法
      console.log("查看政府表彰附件", row);
      this.$message.info("查看附件功能待实现");
    },
    editCommendationItem(row) {
      // 编辑政府表彰项的方法
      console.log("编辑政府表彰项", row);
      this.honorDialogType = "commendation";
      this.honorDialogForm = { ...row };
      this.honorDialogShow = true;
    },
    addCommendationItem() {
      // 新增政府表彰项的方法
      console.log("新增政府表彰");
      this.honorDialogType = "commendation";
      this.honorDialogForm = {}; // 传空对象表示新增
      this.honorDialogShow = true;
    },
    editItem(row) {
      console.log(row, "‘eeee");

      this.dialog1Show = true;
      this.dialog1Form = row;
      console.log(this.dialog1Form, "‘eeee");
    },
    editDialog3Item(row) {
      this.dialog3Show = true;
      this.dialog3Form = row;
    },
    addNegativeItem() {
      // 新增负面信息的方法
      console.log("新增负面信息");
      this.dialog3Form = {}; // 传空对象表示新增
      this.dialog3Show = true;
    },
    delItem(row) {
      this.$modal
        .confirm("是否确认删除？")
        .then(function () {
          // return delProjectDataByIds([row.projectId]);
        })
        .then(() => {
          // this.getList();
          // this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    closeDialog1() {
      this.dialog1Show = false;
    },
    closeDialog3(data) {
      this.dialog3Show = false;
      // 如果有返回数据，说明是确认保存，需要更新列表
      if (data) {
        console.log("保存的负面信息:", data);
        // TODO: 调用接口更新数据
        this.getNegativeList();
      }
    },
    closeHonorDialog(data) {
      this.honorDialogShow = false;
      // 如果有返回数据，说明是确认保存，需要更新列表
      if (data) {
        console.log("保存的数据:", data);
        // TODO: 调用接口更新数据
        // 这里可以调用getHonorList()或getCommendationList()刷新列表
        if (this.honorDialogType === "honor") {
          this.getHonorList();
        } else {
          this.getCommendationList();
        }
      }
    },
    openPersonnelDialog() {
      // 打开人员详情弹窗
      console.log("打开人员详情弹窗");
      this.personnelDialogShow = true;
    },
    closePersonnelDialog() {
      this.personnelDialogShow = false;
    },
    delHonorItem(row) {
      this.$modal
        .confirm("是否确认删除该荣誉信息？")
        .then(() => {
          console.log("删除企业荣誉:", row);
          // TODO: 调用删除接口
          // return delHonorById(row.id);
          this.$modal.msgSuccess("删除成功");
          this.getHonorList();
        })
        .catch(() => {});
    },
    delCommendationItem(row) {
      this.$modal
        .confirm("是否确认删除该表彰信息？")
        .then(() => {
          console.log("删除政府表彰:", row);
          // TODO: 调用删除接口
          // return delCommendationById(row.id);
          this.$modal.msgSuccess("删除成功");
          this.getCommendationList();
        })
        .catch(() => {});
    },
  },
};
</script>

<style lang="scss" scoped>
.formBox {
  .formTable {
    width: 100%;
    border: 1px solid #e4e4dc;
    border-top: none;
  }

  .formRow {
    display: flex;
    width: 100%;
    min-height: 44px;

    &.gray {
      background-color: #eef0f2;
    }

    &:not(.gray) {
      background-color: #fff;
    }

    border-bottom: 1px solid #e4e4dc;
  }

  .formCell {
    display: flex;
    align-items: center;
    min-height: 44px;
    border-right: 1px solid #e4e4dc;
    font-family: MicrosoftYaHei;
    font-size: 12px;
    color: #303133;

    &.left {
      width: 180px;
      padding: 0 15px;
      justify-content: flex-end;
      text-align: right;
      color: #303133;

      &.contact-info-label {
        height: 132px;
        line-height: 132px;
        align-items: center;
      }

      &.title-label {
        background-color: #f8f9fa;
      }

      &.personnel-detail {
        color: #409eff;
        cursor: pointer;

        &:hover {
          color: #66b1ff;
        }
      }
    }

    &.right {
      flex: 1;
      padding: 0 15px;
      text-align: left;
      min-width: 0;

      .el-select {
        width: 100% !important;
      }
      .el-input {
        width: 100% !important;
      }
    }

    &:last-child {
      border-right: none;
    }
  }

  .formHead {
    width: 100%;
    height: 44px;
    background-color: #5d6d7f;
    line-height: 44px;
    text-align: center;
    font-family: MicrosoftYaHei;
    font-weight: bold;
    font-size: 12px;
    color: #ffffff;
    border: 1px solid #e4e4dc;
    border-bottom: none;
  }

  .contact-section {
    display: flex;
    width: 100%;

    .contact-label-cell {
      width: 120px;
      min-height: 132px;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: 0 15px;
      border-right: 1px solid #e4e4dc;
      font-family: MicrosoftYaHei;
      font-size: 12px;
      color: #303133;
      font-weight: 500;
      background-color: #fff;
    }

    .contact-content {
      flex: 1;
      display: flex;
      flex-direction: column;

      .formRow {
        border-bottom: 1px solid #e4e4dc;

        &:last-child {
          border-bottom: none;
        }
      }
    }
  }

  .personnel-section {
    display: flex;
    width: 100%;

    .personnel-label-cell {
      width: 180px;
      min-height: 132px;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      justify-content: center;
      padding: 0 15px;
      border-right: 1px solid #e4e4dc;
      font-family: MicrosoftYaHei;
      font-size: 12px;
      color: #303133;
      background-color: #fff;
      text-align: right;

      > div:first-child {
        margin-bottom: 10px;
      }

      .personnel-detail {
        color: #409eff;
        cursor: pointer;

        &:hover {
          color: #66b1ff;
        }
      }
    }

    .personnel-content {
      flex: 1;
      display: flex;
      flex-direction: column;

      .formRow {
        border-bottom: 1px solid #e4e4dc;

        &:last-child {
          border-bottom: none;
        }
      }
    }
  }

  .equipment-section {
    display: flex;
    width: 100%;

    .equipment-label-cell {
      width: 180px;
      min-height: 132px;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: 0 15px;
      border-right: 1px solid #e4e4dc;
      font-family: MicrosoftYaHei;
      font-size: 12px;
      color: #303133;
      background-color: #fff;
      text-align: right;
    }

    .equipment-content {
      flex: 1;
      display: flex;
      flex-direction: column;

      .formRow {
        border-bottom: 1px solid #e4e4dc;

        &:last-child {
          border-bottom: none;
        }
      }
    }
  }
}

.control-area-cell {
  border: 1px dashed #ccc;
  padding: 4px 8px;
  display: inline-block;
  border-radius: 2px;
}

.attachment-link {
  color: #409eff;
  cursor: pointer;
  text-decoration: underline;

  &:hover {
    color: #66b1ff;
  }
}

::v-deep .el-dialog__header {
  border-bottom: 1px solid #e9e9ec;
}

::v-deep .el-dialog__footer {
  border-top: 1px solid #e9e9ec;
}
.dialog-footer {
  text-align: right;
  padding: 20px 0 0 0;

  .cancel-btn {
    background-color: #fff;
    border: 1px solid #409eff;
    color: #409eff;
    margin-right: 10px;

    &:hover {
      background-color: #ecf5ff;
      border-color: #66b1ff;
      color: #66b1ff;
    }
  }

  // .edit-btn {
  //   background-color: #409eff;
  //   border-color: #409eff;
  //   color: #fff;

  //   &:hover {
  //     background-color: #66b1ff;
  //     border-color: #66b1ff;
  //   }
  // }
}

.summary-table-container {
  margin-top: 20px;

  .summary-table {
    border: 1px solid #e4e4dc;

    .summary-row {
      display: flex;
      min-height: 44px;
      border-bottom: 1px solid #e4e4dc;

      &:last-child {
        border-bottom: none;
      }

      .summary-cell {
        flex: 1;
        padding: 8px 15px;
        border-right: 1px solid #e4e4dc;
        display: flex;
        align-items: center;
        justify-content: center;

        &:last-child {
          border-right: none;
        }

        .summary-label {
          font-family: MicrosoftYaHei;
          font-size: 12px;
          color: #606266;
          text-align: center;
        }

        .summary-value {
          font-family: MicrosoftYaHei;
          font-size: 14px;
          color: #303133;
          font-weight: 500;
          text-align: center;
        }
      }
    }
  }
}
</style>
